/**
 * Created by Administrator on 2016/11/9.
 */
function addEvent(element,event,handle){
    if(element.addEventListener){
        element.addEventListener(event,handle,false);
    }else if(element.attachEvent){
        element.attachEvent('on' + event,handle);
    }else{
        element['on' + event] = handle;
    }
}

function scoreRandom(num){
    var arr = [];
    var sum = 0;
    for(var i = 0;i < num;i++){
        arr[i] = Math.floor(Math.random() * 41 + 60);
        sum += arr[i];
    }
    arr.push(sum);
    return arr;
}

var th_name = ['姓名','语文','数学','英语','总分'];
//alert(th_name.length)
var scoreData = {
    '老大':scoreRandom(3),
    '老二':scoreRandom(3),
    '老三':scoreRandom(3),
    '老四':scoreRandom(3),
    '老五':scoreRandom(3),
    '老六':scoreRandom(3),
    '老七':scoreRandom(3),
    '老八':scoreRandom(3),
    '老九':scoreRandom(3),
    '老十':scoreRandom(3),
    '十一':scoreRandom(3),
    '十二':scoreRandom(3),
    '十三':scoreRandom(3),
    '十四':scoreRandom(3)
};
//alert(scoreData.length)
var scoreFn = function(tdNum,names){
    this.table = document.getElementById('table');
    this.name = names;
    this.tableData = tdNum;
    this.init();
}

scoreFn.prototype = {
    init:function(){
        this.createTable();
//        this.sortScore(3);
        this.createFlag();
        var _this = this;
        var up = document.getElementsByClassName("UpDiv");
        var down = document.getElementsByClassName("DownDiv");
        var i = 0;
//        while(i<up.length){

        addEvent(up[0],'click',function(){
//            alert(i)
            _this.sortScore(1,false);
        });
        addEvent(down[0],'click',function(){
            _this.sortScore(1,true);
        })
        addEvent(up[1],'click',function(){
//            alert(i)
            _this.sortScore(2,false);
        });
        addEvent(down[1],'click',function(){
            _this.sortScore(2,true);
        })
        addEvent(up[2],'click',function(){
//            alert(i)
            _this.sortScore(3,false);
        });
        addEvent(down[2],'click',function(){
            _this.sortScore(3,true);
        })
        addEvent(up[3],'click',function(){
//            alert(i)
            _this.sortScore(4,false);
        });
        addEvent(down[3],'click',function(){
            _this.sortScore(4,true);
        })
//            i++;
//        }

    },
    createTable : function(){
        var name_len = this.name.length;
        var td_len = this.tableData.length;
        var thHtml = '';
        //alert(name_len)
        var tr_th = document.createElement('tr');
        for(var i = 0;i<name_len;i++){
            thHtml += "<th>"+this.name[i]+"</th>";
        }
        tr_th.innerHTML = thHtml;
        this.table.appendChild(tr_th);
        for(var key in this.tableData){
            var td_tr = document.createElement('tr');
            var tdHtml = "<td>"+key+"</td>";
            for(var j = 0;j<this.tableData[key].length;j++){
                tdHtml += "<td>"+this.tableData[key][j]+"</td>"
            }
            td_tr.innerHTML = tdHtml;
            this.table.appendChild(td_tr);
        }
    },
    sortScore:function(number,flag){

        var num = new Array(14);
        var n = 0;
        for(var key in this.tableData) {
            num[n] = new Array(this.tableData[key].length);
            num[n][0] = key;
            for (var i = 0; i < this.tableData[key].length; i++) {
//                alert(this.tableData[key].length)
                num[n][i+1] = this.tableData[key][i];
            }
            n++;
        }
        var len = num.length;
        for(var i = 0;i<len;i++){
            for(var j = len-1;j>0;j--){
                if(flag){
                    if(num[j][number] > num[j-1][number] && i != j ){
                        var temp = num[j];
                        num[j] = num[j-1];
                        num[j-1] = temp;
                    }
                }else{
                    if(num[j][number] < num[j-1][number] && i != j ){
                        var temp = num[j];
                        num[j] = num[j-1];
                        num[j-1] = temp;
                    }
                }


            }
        }
      var tds = document.getElementsByTagName('td');
        for(var m = 0;m < len;m++){
            for(var n = 0;n < this.name.length;n++){
                tds[m*(this.name.length) + n].innerHTML = num[m][n];
            }
        }

    },

    createFlag:function(){
        var ths = document.getElementsByTagName('th');
        for(var i = 1;i<ths.length;i++){
            var myDivUp = document.createElement('div');
            var myDivDown = document.createElement('div');
            myDivUp.className = 'UpDiv';
            myDivDown.className = 'DownDiv';
            ths[i].appendChild(myDivDown);
            ths[i].appendChild(myDivUp);

        }

    }

}

var table = new scoreFn(scoreData,th_name);